<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@taglib prefix="lb" uri="http://www.itlaobing.cn/tags"%>

<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>

<title>TTTTTTTTT</title>

<!-- 这段代码会被 sitemesh拷贝到application.jsp模板中 -->
<js> <script>
	//toast配置
	toastr.options = {
		"closeButton" : false,
		"debug" : false,
		"newestOnTop" : false,
		"progressBar" : false,
		"positionClass" : "toast-top-right",
		"preventDuplicates" : false,
		"onclick" : null,
		"showDuration" : "300",
		"hideDuration" : "1000",
		"timeOut" : "5000",
		"extendedTimeOut" : "1000",
		"showEasing" : "swing",
		"hideEasing" : "linear",
		"showMethod" : "fadeIn",
		"hideMethod" : "fadeOut"
	}
	//js代码中可以嵌入 java代码（包含JSTL，EL），但是只能在 jsp页面上，js文件中不起作用。
	$(function() {
		<c:if test="${not empty toastMsg}">
		toastr["success"]("${toastMsg}")
		</c:if>

		$(document).on("click", ".btn-delete", function(event) {

			//阻止事件冒泡
			event.stopPropagation();
			//阻止默认的事件
			event.preventDefault();

			//取出要提交的地址
			var href = $(this).prop("href");

			//发起ajax请求
			$.ajax({
				type : "POST",
				url : href,
				data : {
					_method : "DELETE"
				}
			}).success(function(data) {
				if (data) {
					$("#row" + data.id).remove();//移除表格的行
					toastr["success"]("删除" + data.area + "成功！");
				}
				location.reload();

			});

		});

	});
</script> </js>






<div class="row no-gutter">

	<div class="panel panel-default">

		<div class="panel-heading">
			<h4>[区域]列表</h4>
			<ul class="links">
                    <li>
                        <a href="${ctx}/yikes/create" class="btn btn-primary"
				style="color: #FFFFFF">添加</a>
                    </li>
                </ul>
		</div>
		<div class="row" style="margin-left: 25px;margin-top: 20px;">
			<form id="searchable"
				class="form-horizontal"
				action="${ctx}/yikes/yyy" method="get">
				<div class="col-xs-3">
					<input path="area"
						name="area"
						class="form-control" placeholder="请输入区域名称" type="text" value="" style="height: 35px">
				</div>
				<div class="col-xs-3">
					<button type="submit" class="btn btn-sm btn-success">
						查询 <span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
					</button>
				</div>
			</form>
		</div>
		<div class="panel-body">
		
			<table class="table table-hover table-condensed table-bordered">
				<caption>区域表</caption>
				<thead>
					<tr>
						<th>序号</th>
						<th>区域名称</th>
						<th>简拼码</th>
						<th>备注</th>
						<th>状态</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach var="yike" items="${yikes}" varStatus="stat">
						<tr id="row${yike.id}">
							<th scope="row">${stat.index +1}</th>
							<td>${yike.area}</td>
							<td>${yike.shortCode}</td>
							<td>${yike.comment}</td>
							<td>${yike.status}</td>
							<td>
								<div class="btn-group" role="group" aria-label="...">
									<a class="btn btn-info"> <i class="fa fa-eye fa-lg"
										aria-hidden="true"></i></a> <a
										href="${ctx}/yikes/${yike.id}/update" class="btn btn-success">
										<i class="fa fa-edit fa-lg" aria-hidden="true"></i>
									</a> <a href="${ctx}/yikes/${yike.id}"
										class="btn btn-danger btn-delete"> <i
										class="fa fa-trash-o fa-lg" aria-hidden="true"></i></a>
								</div>
							</td>
						</tr>
					</c:forEach>

				</tbody>
			</table>
		</div>



	</div>



	<lb:pagination pager="${yikes}" />


</div>






